<!DOCTYPE html>
<html ng-app="app" lang="en">
    <head>
        <meta charset="UTF-8">
        <title ng-bind="title"></title>
        <link rel="stylesheet" href="../../style/css/bootstrap.css">
        <link rel="stylesheet" href="../../style/css/matrix-style.css">
        <link rel="stylesheet" href="../checkbox/checkbox.css">
        <script src="../../../node_modules/angular/angular.js"></script>
        <script src="../../a.ui.js"></script>
        <script src="radio.js"></script>
        <script>
            // bootstrap app
            var app = angular.module('app', ['a.ui']);
            app.run(function ($rootScope) {
                $rootScope.title = 'Radio';
                $rootScope.checked = true;
                $rootScope.professions = {
                    p1: {name: '程序员', value: 1},
                    p2: {name: '测试', value: 2},
                    p3: {name: '客服', value: 3},
                    p4: {name: '销售', value: 4},
                    p5: {name: '财务', value: 5}
                };
                $rootScope.profession = 1;
                $rootScope.xx = ['choose 1', 'choose 2', 'choose 3'];
                $rootScope.xxx = 'choose 3';
            });
        </script>
    </head>
    <body>
        <div class="container">
            <h1 class="text-center" ng-bind="title"></h1>
            <p>
                基本1(text-field/value-field):
                <a-radio ng-model="profession" data="professions.p1" name="profession" display-field="name" value-field="value"></a-radio>
                <a-radio ng-model="profession" data="professions.p2" name="profession" display-field="name" value-field="value"></a-radio>
                <a-radio ng-model="profession" data="professions.p3" name="profession" display-field="name" value-field="value"></a-radio>
                &emsp;选择结果: <span ng-bind="profession"></span>
            </p>
            <p>
                基本2(无text-field/value-field):
                <a-radio ng-model="xxx" data="xx[0]" name="xxx"></a-radio>
                <a-radio ng-model="xxx" data="xx[1]" name="xxx"></a-radio>
                <a-radio ng-model="xxx" data="xx[2]" name="xxx"></a-radio>
                &emsp;选择结果: <span ng-bind="xxx"></span>
            </p>
            <p>
                ReadOnly:
                <a-radio ng-model="profession" data="professions.p4" name="profession" display-field="name" value-field="value" readonly="true"></a-radio>
            </p>
            <p>
                Disabled:
                <a-radio ng-model="profession" data="professions.p5" name="profession" display-field="name" value-field="value" disabled="true"></a-radio>
            </p>
            <p>

            </p>
        </div>
    </body>
</html>